<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>查看报价单</title>
    <%@ include file="/WEB-INF/views/include/head.jsp"%>
    <script src="j${ctxStatic}/s/jquery-1.9.1.min.js"></script>
    <script src="${ctxStatic}/js/DateTimePicker.js"></script>
    <script src="${ctxStatic}/js/layer.js"></script>
    <script src="${ctxStatic}/js/style.js"></script>
    <link rel="stylesheet" href="${ctxStatic}/css/common.css">
    <link rel="stylesheet" href="${ctxStatic}/css/layerSm.css">
    <script>
    $(function(){
            $(".tabBox ul li").each(function(){
                var index=$(this).index();

                $(".tabBox ul li").eq(0).addClass("active");

                $(this).click(function(){

                    //alert(index);

                    $(this).addClass("active").siblings().removeClass("active");

                    $(".tabBoxSm > .tabSm").eq(index).stop(true).show().siblings().stop(true).hide();
					
					var tableW = $(".tabBoxSm > .tabSm").eq(index).find('.tableHead').width();
					var tabodyH = $(".tabBoxSm > .tabSm").eq(index).find('.tableBody').height();
					var tableScrollH = $(".tabBoxSm > .tabSm").eq(index).find('.tableScroll').height();
					if(tabodyH>tableScrollH){
						$(".tabBoxSm > .tabSm").eq(index).find('.tableScroll').css('width',tableW + 18 + 'px')
					}else{
						$(".tabBoxSm > .tabSm").eq(index).find('.tableScroll').css('width','inherit')
					}

                })

            })

        })
        
        $(document).ready(function(){
        	imageList("${quotation.styleID}","${quotation.styleFile}");
        	$(".btn").hide();
        	var row = document.getElementById("materialTable").rows.length;
    		$("#materialSum").val(row);
    		sumAmount();
        });
    
    function close() {
		closeWin();
	}
        
    function imageList(styleID,styleFile) {
    	url = "?styleID="+styleID+"&styleFile="+styleFile;
    	$.post("${ctx}/quotation/message/findImageList"+url, "", function(result) {
    		var styleImageList = result["imageListHtml"];
    		$("#nameImagePreview").html(styleImageList);
    		$("#nameImagePreview").find("a").remove();
    		$(".square ol li").removeClass("active");
    		$(".square ol li:last-child").addClass("active");
    		$("#nameImagePreview img").attr("width","200px");
    		$("#nameImagePreview img").attr("height","200px");
    	}, 'json');
	}
    
    /* 计算报价金额  */
    function sumAmount(){
	   	var totalAmount = parseFloat(0);
	   	var amount;
	   	$.each($(".amount"),function(i,e){
	   		amount = $(e).text().replace(/,/g, "");
	   		totalAmount = totalAmount + parseFloat(amount);
	       });
	   	$("#unitCost").val(totalAmount);
	   	formatMoney($("#unitCost"), 2);
    }
    </script>
</head>
<body>   
<div class="layerHeader clearfix">
	<p class="headerTitle"><spring:message code="quotation_create_viewQuotation"/></p>
    <div class="headerButton clearfix">
    	<shiro:hasPermission name="quotation:message:audit">
        	<button type="button" onclick="popup('800px','519px','${ctx}/quotation/message/audit?id=${quotation.id }')"><spring:message code="quotation_create_check"/></button>
        </shiro:hasPermission>
        <%-- <button type="button"><spring:message code="quotation_create_history"/></button>
        <button type="button" onclick=""><spring:message code="quotation_create_download"/></button> --%>
        <shiro:hasPermission name="quotation:message:edit">
        	<button type="button" onclick="window.location.href='${ctx}/quotation/message/editQuotation?id=${quotation.id }'"><spring:message code="quotation_create_editQuotation"/></button>
        </shiro:hasPermission>
        <button type="button" onclick="closeWin()"><spring:message code="quotation_create_cancle"/></button>
    </div>
</div>
<div class="tabBox">
    <ul class="clearfix">
     	<li class="active"><spring:message code="quotation_create_information"/></li>
        <li><spring:message code="quotation_create_material"/></li>
    </ul>
    
</div>
<div class="tabBoxSm showHtml" style="overflow-y: auto;height: 574px;">
    <div class="tabSm smOrderBox">
        <div class="items clearfix">
            <div class="col-33 clearfix">
                <p class="tit"><spring:message code="quotation_create_styleNO"/></p>
                <input type="hidden" id="styleID" name="styleID"  value="${quotation.styleID}">
                <input id="styleNO" name="styleNO"  value="${quotation.styleNO}" readonly="readonly">
            </div>
            <div class="col-33 clearfix">
                <p class="tit"><spring:message code="quotation_create_styleNameCN"/></p>
                <input id="styleNameCN" name="styleNameCN"  value="${quotation.styleNameCN}" readonly="readonly">
            </div>
             <div class="col-33 clearfix">
                <p class="tit"><spring:message code="quotation_create_styleCustomerName"/></p>
                <input id="styleCustomerName" name="styleCustomerName"  value="${quotation.styleCustomerName}" readonly="readonly">
            </div>
        </div>
        <div class="items clearfix">
            <div class="col-33 clearfix haveToBox">
                <p class="tit"><spring:message code="quotation_create_unitCostNO"/></p>
                <input id="unitCostNO" name="unitCostNO"  value="${quotation.unitCostNO}" readonly="readonly">                
                <p class="haveTo">*</p>
            </div>
            <div class="col-33 clearfix">
                <p class="tit"><spring:message code="quotation_create_unitCost"/></p>
                <input id="unitCost" name="unitCost"  value="<fmt:formatNumber value="${quotation.unitCost}" pattern="#,##0.00#"/>" readonly="readonly">
            </div>
            <div class="col-33 clearfix">
                <p class="tit"><spring:message code="quotation_create_materialQuantity"/></p>
                <input id="materialSum" name="materialSum"  value="" readonly="readonly">
            </div>
        </div>
        <p class="title"><spring:message code="quotation_create_quotationMessege"/></p>
        <div class="clearfix">
        	<div class="left w-500">
            	<div class="items clearfix">        	
                    <div class="col-50 clearfix">
                        <p class="tit"><spring:message code="quotation_create_quotationType"/></p>
                        <input id="offerTypeCN" name="offerTypeCN"  value="${quotation.offerTypeCN }" readonly="readonly">
                    </div>
                    <div class="col-50 clearfix">
                        <p class="tit"><spring:message code="quotation_create_offerDate"/></p>
                        <input id="offerDate" name="offerDate" type="text" readonly="readonly" value="<fmt:formatDate value="${quotation.offerDate }" pattern="yyyy-MM-dd" />" >

                    </div>
                </div>
                <div class="items clearfix">        	
                    <div class="col-50 clearfix">
                        <p class="tit"><spring:message code="quotation_create_currency"/></p>
                        <input id="offerCurrencyCN" name="offerCurrencyCN"  value="${quotation.offerCurrencyCN }" readonly="readonly">
                    </div>
                    <div class="col-50 clearfix">
                        <p class="tit"><spring:message code="quotation_create_exchangeRate"/></p>
                        <input id="offerExchangeRate" name="offerExchangeRate"  value="<fmt:formatNumber value="${quotation.offerExchangeRate }" pattern="###0.000#"/>" readonly="readonly">
                    </div>
                </div>
                <div class="items clearfix">        	
                    <div class="col-50 clearfix">
                        <p class="tit"><spring:message code="quotation_create_offerQuantity"/></p>
                        <input id="offerQuantity" name="offerQuantity"  value="<fmt:formatNumber value="${quotation.offerQuantity }" pattern="#,##0.###"/>" readonly="readonly">
                    </div>
                    <div class="col-50 clearfix">
                        <p class="tit"><spring:message code="quotation_create_offerAmount"/></p>
                        <input id="offerAmount" name="offerAmount"  value="<fmt:formatNumber value="${quotation.offerAmount }" pattern="#,##0.00#"/>" readonly="readonly">
                    </div>
                </div>
                 <div class="items clearfix">        	
                    <div class="col-50 clearfix">
                        <p class="tit"><spring:message code="quotation_create_offerMargins"/></p>
                        <input id="offerMargins" name="offerMargins"  value="<fmt:formatNumber value="${quotation.offerMargins }" pattern="#,##0.00#"/>" readonly="readonly">
                    </div>
                    <div class="col-50 clearfix">
                        <p class="tit"><spring:message code="quotation_create_offerCM"/></p>
                        <input id="offerCM" name="offerCM"  value="<fmt:formatNumber value="${quotation.offerCM }" pattern="#,##0.00#"/>" readonly="readonly">
                    </div>
                </div>
                 <div class="items clearfix">        	
                    <div class="col-50 clearfix">
                        <p class="tit"><spring:message code="quotation_create_offerRebate"/></p>
                        <input id="offerRebate" name="offerRebate"  value="<fmt:formatNumber value="${quotation.offerRebate }" pattern="###0.##"/>" readonly="readonly">
                    </div>
                    <div class="col-50 clearfix">
                        <p class="tit"><spring:message code="quotation_create_offerBrokerage"/></p>
                        <input id="offerBrokerage" name="offerBrokerage"  value="<fmt:formatNumber value="${quotation.offerBrokerage }" pattern="#,##0.00#"/>" readonly="readonly">
                    </div>
                </div>
                <div class="items clearfix" style="margin-bottom:0;">     
                    <p class="tit"><spring:message code="quotation_create_remark"/></p>
                    <textarea id="remark" name="remark" style="width:448px;height: 60px" readonly="readonly">${quotation.remark }</textarea>
                </div>
            </div>
            <div class="">
            	<div class="styleImgBg clearfix" style="width: 310px; height: 300px; padding-top: 30px; margin-left: 85px; float: left;">
							<div class="squareBtn squareL" style="margin-left: -85px;margin-top:-57px">
								<img src="${ctxStatic}/images/btn_left.png">
							</div>
						       <div class="square" style="width: 330px; height: 230px; margin-top: -1px; margin-left: -30px;">
							   <input type="hidden" id="nameImage" name="myStyleFile" value="${myStyleFileTemp}" htmlEscape="false" class="input-xlarge" />
							   <sys:ckfinder input="nameImage" type="images"  uploadPath="/bigcargoStyle" selectMultiple="true" maxWidth="100" maxHeight="100" />
						       </div>
							<div class="squareBtn squareR" style="margin-top:-287px;margin-left:300px">
								<img src="${ctxStatic}/images/btn_right.png">
							</div>
						</div>
            </div>
        </div>
         <p class="title" style="margin-top:0;margin-bottom:5px;"><spring:message code="quotation_create_history"/></p>
         <div class="tableArea">
        	<div class="tableScroll tableScrollSm" >
        		<table cellpadding="0" class="tableHead">
                    <thead>
                    <tr>
                    	<th class="tab-bjr"><spring:message code="quotation_create_quotator"/></th>
                        <th class="tab-rq"><spring:message code="quotation_create_quotationDate"/></th>
                        <th class="tab-mianl"><spring:message code="quotation_create_materail"/></th>
                        <th class="tab-ful"><spring:message code="quotation_create_accessorie"/></th>
                        <th class="tab-yxh"><spring:message code="quotation_create_printingEmbroidery"/></th>
                        <th class="tab-bp"><spring:message code="quotation_create_brand"/></th>
                        <th class="tab-jgf"><spring:message code="quotation_create_CM"/></th>
                        <th class="tab-lr"><spring:message code="quotation_create_margins"/></th>
                        <th class="tab-zk"><spring:message code="quotation_create_rebate"/></th>
                        <th class="tab-yj"><spring:message code="quotation_create_brokerage"/></th>
                        <th class="tab-bj"><spring:message code="quotation_create_quotation"/></th>
                    </tr>
                    </thead>
                </table>
                <table cellpadding="0" class="tableBody">
                    <tbody>
                   <c:forEach items="${quotation.quotationHistoryList }" var="history">
                    <tr>
                    	<td class="tab-bjr">${history.createBy.firstName}</td>
                        <td class="tab-rq"><fmt:formatDate value="${history.offerDate }" pattern="yyyy-MM-dd" /></td>
                        <td class="tab-mianl"><fmt:formatNumber value="${history.materail}" pattern="#,##0.00#"/></td>
                        <td class="tab-ful"><fmt:formatNumber value="${history.accessorie}" pattern="#,##0.00#"/></td>
                        <td class="tab-yxh"><fmt:formatNumber value="${history.printingEmbroidery}" pattern="#,##0.00#"/></td>
                        <td class="tab-bp"><fmt:formatNumber value="${history.brand}" pattern="#,##0.00#"/></td>
                        <td class="tab-jgf"><fmt:formatNumber value="${history.offerCM}" pattern="#,##0.00#"/></td>
                        <td class="tab-lr"><fmt:formatNumber value="${history.offerMargins}" pattern="#,##0.00#"/></td>
                        <td class="tab-zk"><fmt:formatNumber value="${history.offerRebate}" pattern="#,##0.00#"/></td>
                        <td class="tab-yj"><fmt:formatNumber value="${history.offerBrokerage}" pattern="#,##0.00#"/></td>
                        <td class="tab-bj"><fmt:formatNumber value="${history.offerAmount}" pattern="#,##0.00#"/></td>
                    </tr>
                   </c:forEach>
                    </tbody>
                </table>
            </div>
        </div>
	</div>
    <div class="tabSm none">
    	<div class="tableArea">
        	<div class="tableScroll tableScrollSm">
        		<table cellpadding="0" class="tableHead">
                    <thead>
                    <tr>
                        <th><p class="tab-wltp"><spring:message code="quotation_create_materailImage"/></p></th>
                        <th><p class="tab-wlmcbj"><spring:message code="quotation_create_materailNameNO"/></p></th>
                        <th><p class="tab-wllb"><spring:message code="quotation_create_materailType"/></p></th>
                        <th><p class="tab-fk"><spring:message code="quotation_create_materailSpec"/></p></th>
                        <th><p class="tab-dw"><spring:message code="quotation_create_materailSpecUnit"/></p></th>
                        <th><p class="tab-dh" style="width: 70px;"><spring:message code="quotation_create_materailCost"/></p></th>
                        <th><p class="tab-sh" style="width: 70px;"><spring:message code="quotation_create_materailPreLoss"/></p></th>
                        <th><p class="tab-zdj" style="width: 70px;"><spring:message code="quotation_create_materailSellUnitPrice"/></p></th>
                        <th><p class="tab-dj" style="width: 70px;"><spring:message code="quotation_create_materailUnitPrice"/></p></th>
                        <th><p class="tab-ts" style="width: 70px;"><spring:message code="quotation_create_materailTaxRebate"/></p></th>
                        <th><p class="tab-jj" style="width: 70px;"><spring:message code="quotation_create_materailTotalPrice"/></p></th>
                        <th><p class="tab-hjje" style="width: 100px;"><spring:message code="quotation_create_materailSellTotalPrice"/></p></th>
                    </tr>
                    </thead>
                </table>
                <table cellpadding="0" class="tableBody" id="materialTable">
                    <tbody>
                    <c:forEach items="${quotation.quotationMaterialList }" var="material">
                    <tr>
                        <td><p class="tab-wltp"><c:if test="${material.materialFile!=null && material.materialFile!='' }"><img src="${material.materialFile }" class="wltp"></c:if><c:if test="${material.materialFile==null||material.materialFile=='' }"><img src="${ctxStatic}/images/pic-none.jpg" class="wltp"></c:if></p></td>
                        <td><p class="tab-wlmcbj">${material.materialCode }<br>${material.materialNameCN }</p></td>
                        <td><p class="tab-wllb">${material.styleMaterialTypeCN }</p></td>
                        <td><p class="tab-fk">${material.materialSpec }</p></td>
                        <td><p class="tab-dw">${material.materialSpecUnit }</p></td>
                        <td><p class="tab-dh" style="width: 70px;"><fmt:formatNumber value="${material.materialCost }" pattern="#,##0.00#"/></p></td>
                        <td><p class="tab-sh" style="width: 70px;"><fmt:formatNumber value="${material.materialPreLoss }" pattern="#,##0.00#"/></p></td>
                        <td><p class="tab-zdj" style="width: 70px;"><fmt:formatNumber value="${material.materialUnitExpend }" pattern="#,##0.00#"/></p></td>
                        <td><p class="tab-dj" style="width: 70px;"><fmt:formatNumber value="${material.materialUnitPrice }" pattern="#,##0.00#"/></p></td>
                        <td><p class="tab-ts" style="width: 70px;"><fmt:formatNumber value="${material.materialTaxRebate }" pattern="#,##0.00#"/></p></td>
                        <td><p class="tab-jj" style="width: 70px;"><fmt:formatNumber value="${material.materialUnitPrice*material.materialTaxRebate }" pattern="#,##0.00#"/></p></td>
                        <td><p class="tab-hjje amount" style="width: 100px;"><fmt:formatNumber value="${material.materialUnitPrice*material.materialTaxRebate*material.materialUnitExpend }" pattern="#,##0.00#"/></p></td>
                    </tr>
                    </c:forEach>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    
</div>
<script>
	window.onload = function(){
			var windowH = window.innerHeight
					||document.documentElement.clientHeight
					||document.body.clientHeight
			$('.tabSm').css({
				'height':windowH - 77,
			});
			$('.tableScrollSm').css({
				'height':windowH - 91
			})
		}
	$('.squareL').on('click', function() {
	    var lastCon = $('.square ol li:last-child').detach();
	    $('.square ol').prepend(lastCon)
	    $('.square ol li:last-child').addClass('active')
	    $('.square ol li:last-child').siblings().removeClass('active')
	})

	$('.squareR').on('click', function() {
	    var lastCon = $('.square ol li:first-child').detach();
	    $('.square ol').append(lastCon)
	    $('.square ol li:last-child').addClass('active')
	    $('.square ol li:last-child').siblings().removeClass('active')
	})
</script>
</body>
</html>
